$(function(){
    var flag=false;
    /*
    //点击事件
    $("#id1").click(function(){
        console.log($("#id1").css("color"))
        if($("#id1").css("color") == "rgb(0, 0, 0)"){
        //if(!flag){
            $("#id1").css("background-color","blue");
            $("#id1").css("color","white");
            flag = true;
        }else{
            $("#id1").css("background-color","");
            $("#id1").css("color","");
            flag = false;
        }
    });

    //悬停事件
    $("#id1").mouseover(function(){
        $(this).css("color","red");
    });

    //移开事件
    $("#id1").mouseout(function(){
        $(this).css("color","");
    });
    */

    $("#id1").mouseover(function(){
        $(this).css("color","red");
    }).mouseout(function(){
        $(this).css("color","");
    }).click(function(){
        $(this).css("background-color","blue");
    })

    //键盘事件
    $("#id2").keydown(function(event){
        //console.log(event.keyCode)
        if(event.keyCode == 13){
            $("#id3").focus();
        }
    });

    //失去焦点事件
    $("#id3").blur(function(){
        var txt2 = $(this).val();
        if(!txt2){
            alert('不能为空！')
        }
    });

    //表单提交事件
    $("form").submit(function(){
        console.log("进来了");
        return false;
    });

    //复合事件：鼠标悬停和移开
    //第一个是悬停，第二个移开
    $("#id4").hover(
        function(){
            $(this).css("background-color","pink");
        },
        function(){
            $(this).css("background-color","");
        }
    );

    //复合事件：连续点击
    //每一个function都是点击事件触发的函数
    // $("#id5").toggle(
    //     function(){//表示点击1、4、7...次时触发的函数
    //         $(this).css("background-color","red");
    //     },
    //     function(){//表示点击2、5、8...次时触发的函数
    //         $(this).css("background-color","blue");
    //     },
    //     function(){//表示点击3、6、9...次时触发的函数
    //         $(this).css("background-color","green");
    //     }
    // );

    //绑定事件
    // $("#id6").bind("click",function(){
    //     var fs = parseInt($(this).css("font-size"));
    //     $(this).css("font-size",fs+10+"px");
    // }).bind("mouseout",function(){
    //     $(this).css("font-size","16px");
    // });
    $("#id6").bind({
        "click":function(){
            var fs = parseInt($(this).css("font-size"));
            $(this).css("font-size",fs+10+"px");
        },
        "mouseout":function(){
            $(this).css("font-size","16px");
        }
    });


    //解绑定
    //$("#id6").unbind("mouseout");
    //$("#id6").unbind();//移除所有事件
    //$("#id6").unbind("mouseout").unbind("click");

    // $("#id1").unbind("click");

    $("#id8").click(function(){
        $("#id7").toggle();
    });
    
    $("#id10").click(function(){
        $("#id9").toggleClass("sty");
    });

    $(window).resize(function(){
        console.log("!");
    });

    $(window).scroll(function(){
        console.log("#");
    })

    $("#id11").css({"color":"red","font-size":"26px","text-shadow":"10px 10px 2px silver"})
    .css("color","");

    // $("#id12").addClass("sty sty2");
    $("#id12").addClass("sty").addClass("sty2");

    //$("#id12").removeClass("sty2").removeClass("sty");
    $("#id12").removeClass("sty2 sty")

    $("#id13").click(function(){
        $("#id15").show(2000);
    });
    $("#id14").click(function(){
        $("#id15").hide(2000);
    });

    $("#id16").click(function(){
        $("#id18").fadeIn(2000);
    });
    $("#id17").click(function(){
        $("#id18").fadeOut(2000);
    });

    $("#id19").click(function(){
        $("#id21").slideDown(2000);
    });
    $("#id20").click(function(){
        $("#id21").slideUp(2000);
    });

    $("#id23").click(function(){
        $("#id22").animate({"width":"500px","opacity":"0.4"},3000);
        $("#id22").animate({"width":"200px","opacity":"1"},3000);
    });
    

})